<template>
  <div style="padding:20px 0;">
    <van-cell title="姓名" :value="userInfo.realname" />
    <van-cell title="人脸识别id" :value="userInfo.PersonId" />
    <div style="padding: 10px;display: flex;align-items: center;justify-content: center;">
      <el-image
        style="width: 200px; height: 200px"
        :src="path+userInfo.sfzheader"
        fit="fill"
      ></el-image>
    </div>
    <div style="padding: 10px;display: flex;align-items: center; justify-content: center;">
      <el-upload
        class="avatar-uploader"
        :action="PERSONUPLOAD"
        :show-file-list="false"
        :on-success="handleBeforeUpload3"
      >
        <van-button icon="plus" type="primary">上传照片</van-button>
      </el-upload>
    </div>
  </div>
</template>

<script>
import api from "@/api/index";
import { Toast,Button,Cell} from "vant";
import { Upload,Image} from "element-ui";
export default {
  props:['callback'],
  components: {
    [Upload.name]: Upload,
    [Image.name]: Image,
    [Button.name]: Button,
    [Cell.name]: Cell,
  },
  data() {
    return {
      path: api.AssetServerUrl,
      userInfo: {},
       PERSONUPLOAD:
        window.location.hostname == "localhost"
          ? "/" + api.UPDATA_FILE
          : api.AssetServerUrl + api.UPDATA_FILE,
    };
  },
  created() {
    this.getUserInfo();
  },
  methods: {
    getUserInfo() {
      Toast.loading({ message: "加载中...", forbidClick: true });
      this.$http
        .get(api.SEARCH_USERINFO, {})
        .then((res) => {
          Toast.clear();
          console.log("列表", res);
          if (res.status == 1) {
            this.userInfo = res.data;
          } else {
            Toast.fail(res.msg);
          }
        })
        .catch((err) => {
          console.log("err", err);
          Toast.clear();
          Toast.fail(JSON.stringify(err));
        });
    },
    handleBeforeUpload3(response) {
      Toast.loading({ message: "加载中...", forbidClick: true });
      if (response.status == 1) {
        //上传腾讯云
        this.updata_tx(response.urlxd);
      } else {
        Toast.clear();
        this.$message.error("上传失败");
      }
    },
    updata_tx(url) {
      this.$http
        .get(api.USER_UPLOAD_TX, {
          headimg: url,
          realname: this.userInfo.realname,
        })
        .then((res) => {
          Toast.clear();
          console.log("列表", res);
          if (res.status == 1) {
            Toast.success("上传成功");
            if(typeof this.callback == 'function')this.callback()
          } else {
            Toast.fail(res.msg);
          }
        })
        .catch((err) => {
          console.log("err", err);
          Toast.clear();
          Toast.fail(JSON.stringify(err));
        });
    },
  },
};
</script>

<style lang="less">
.goods {
  padding-bottom: 50px;

  &-swipe {
    img {
      width: 100%;
      display: block;
    }
  }

  &-title {
    font-size: 16px;
  }

  &-price {
    color: #f44;
  }

  &-express {
    color: #999;
    font-size: 12px;
    padding: 5px 15px;
  }

  &-cell-group {
    margin: 15px 0;

    .van-cell__value {
      color: #999;
    }
  }

  &-tag {
    margin-left: 5px;
  }
}
</style>
